<template>
  <div class="users-base-wrapper">
    <!-- <div class="module-name">受试者状态</div> -->
    <div class="function-details-layout">
      <el-row style="text-align: left; margin-bottom: 16px;">
        <el-button type="primary" size="mini" @click="handleSave">保存</el-button>
      </el-row>
      <el-form :rules="rules" ref="formRef" size="mini" :model="formData" label-width="320px">
        <el-form-item label="研究者签字：" prop='studySign'>
          <el-radio-group v-model="formData.studySign">
            <el-radio :label="0">是</el-radio>
            <el-radio :label="1">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="研究者批注：" prop='studyText'>
          <el-radio-group v-model="formData.studyText">
            <el-radio :label="0">是</el-radio>
            <el-radio :label="1">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="需要质疑：" prop='query'>
          <el-radio-group v-model="formData.query">
            <el-radio :label="0">是</el-radio>
            <el-radio :label="1">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="是否显示姓名缩写：" prop='nameShort'>
          <el-radio-group v-model="formData.nameShort">
            <el-radio :label="0">是</el-radio>
            <el-radio :label="1">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="数值格式选择NA/ND/UK：" prop='numFormat'>
          <el-radio-group v-model="formData.numFormat">
            <el-radio :label="1">是</el-radio>
            <el-radio :label="0">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="方案版本与知情同意：" prop='schemeAgree'>
          <el-radio-group v-model="formData.schemeAgree">
            <el-radio :label="1">是</el-radio>
            <el-radio :label="0">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="录入说明显示位置：" prop='entryState'>
          <el-radio-group v-model="formData.entryState">
            <el-radio :label="1">录入域后</el-radio>
            <el-radio :label="0">变量名后</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="是否开启导入功能：" prop='importStatus'>
          <el-radio-group v-model="formData.importStatus">
            <el-radio :label="1">是</el-radio>
            <el-radio :label="0">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="数据库锁定检测方式：" prop='databaseLock'>
          <el-radio-group v-model="formData.databaseLock">
            <el-radio :label="1">已录入访视内ecrf已录入完成</el-radio>
            <el-radio :label="0">所有ecrf已录入完成</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="失效编码是否隐藏：" prop='loseCode'>
          <el-radio-group v-model="formData.loseCode">
            <el-radio :label="1">是</el-radio>
            <el-radio :label="0">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="是否开启受试者废弃：" prop='subjectWaste'>
          <el-radio-group v-model="formData.subjectWaste">
            <el-radio :label="0">是</el-radio>
            <el-radio :label="1">否</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>
<script>

import { mapActions } from 'vuex'

export default {
  name: 'function-params',

  data() {
    return {
      functionParamsData: [],
      formData: {},
      rules: {
        studySign: [{ required: true, message: '请选择', trigger: 'blur' }],
        studyText: [{ required: true, message: '请选择', trigger: 'blur' }],
        query: [{ required: true, message: '请选择', trigger: 'blur' }],
        nameShort: [{ required: true, message: '请选择', trigger: 'blur' }],
        numFormat: [{ required: true, message: '请选择', trigger: 'blur' }],
        schemeAgree: [{ required: true, message: '请选择', trigger: 'blur' }],
        entryState: [{ required: true, message: '请选择', trigger: 'blur' }],
        importStatus: [{ required: true, message: '请选择', trigger: 'blur' }],
        databaseLock: [{ required: true, message: '请选择', trigger: 'blur' }],
        loseCode: [{ required: true, message: '请选择', trigger: 'blur' }],
        subjectWaste: [{ required: true, message: '请选择', trigger: 'blur' }],
      },
      loading: false
    }
  },
  mounted() {
    this.getFunctionParamsData()
  },

  methods: {
    ...mapActions('eCRFDesign', ['qryFunctionParamsData', 'addFunctionParamsData', 'editFunctionParamsData']),

    // 查询功能参数详情
    getFunctionParamsData() {
      const params = {
        projectId: '001-004'
      }
      this.qryFunctionParamsData({ params }).then((res) => {
        const { data, code, message } = res
        if (code === 200) {
          this.functionParamsData = data
          this.formData = { ...data }
        } else {
          this.$message.error(message || '服务异常，请稍后重试!')
        }
      })
    },

    // 保存
    handleSave() {
      this.$refs.formRef.validate((valid) => {
        this.loading = true
        const data = {
          ...this.formData,
          projectId: '001-004',
        }
        console.log('this.functionParamsData', this.functionParamsData)
        if (!this.functionParamsData) {
          this.addFunctionParamsData({ data }).then(res => {
            const { code } = res
            if (code === 200) {
              this.$message({
                message: '保存成功',
                type: 'success'
              })
              this.getFunctionParamsData()
            }
            this.loading = false
          })
        } else {
          this.editFunctionParamsData({ data }).then(res => {
            const { code } = res
            if (code === 200) {
              this.$message({
                message: '保存成功',
                type: 'success'
              })
              this.getFunctionParamsData()
            }
            this.loading = false
          })
        }
      })

    },

  },
}
</script>
<style lang="scss" scoped>
@import './index.scss';
</style>
